<template>
  <div class="col-md-10 col-md-offset-1">
    <div class="panel-body">
      <div class="row">
        <div class="panel-heading">
          <i class="line"></i>
          <h3>
            {{cate.cateName}}
             <router-link class="btn" :to="{ name: 'CateView', params: { id: cate.cateId } }">查看更多 »</router-link>
          </h3>
        </div>
      </div>
      <div class="row">
        <div class="col-md-2">
          <div class="cate">
            <img :alt="cate.cateName" :src="SERVER_URL+cate.catePic" />
          </div>
        </div>
        <div class="col-md-10">
             <div class="col-md-3" v-for="g in products.list" :key="g.goodsId">
                <product :product="g"></product>
             </div>  
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { SERVER_URL,http } from '../utils/http'
import Product from "./Product.vue"
export default {
  props:['cate'],
  data() {
    return {
      SERVER_URL,
      products:{}
    }
  },
  components:{
    Product
  },
  computed:{

 
  },
  created(){
     http.get( "/goods/getGoodsByCate",{params:{cateId:this.cate.cateId}}).then((resp) => {
      console.log(resp)
          this.products=resp.data.goods;
        })
  }
}
</script>
<style scoped>
.cate img {
	height: 120%;
	width: 100%;
}

.cate {
	text-align: center;
	align: center;
}

.goods-item h3 {
	height: 2em
}
</style>
